(function() {
	var page           = pf.newPage('topic');
	page.IS_SHOW_BOARD = true;
	var $el            = null;

	var c = {
		imgFormat: './image/items/main_%s.jpg',
		iconFormat: '<div data-name = "main_%s_icon" class="icon-btn sprite main_%s_icon"></div>',
		items:     [
			// {id: 'wdy', title: 'what_in_line'},
			{id: 'aboutporsche', title: 'about_porsche'},
			{id: 'pcpuxi', title: 'puxicenter_sh'},
			{id: 's_a', title: 'service_accessories'},
			{id: 'motorsport', title: 'motorsport'},
			{id: 'events', title: 'porsche_events'}
		]
	};

	/**
	 * 初始化时调用
	 */
	page.onCreate = function() {
		$el = page.$el;

		// render
		var html = '';

		var itemTpl = '<li data-id="%s" class="item so-btn" style="background-image:url(%s)">%s<table class="sub-title"><tr><td>%s</td></tr></table></div>';
		var data = $.extend(true, {}, c);
		_.each(data.items, function(v, k) {
			var iconHtml = util.format(data.iconFormat, v.id, v.id);
			var imageUrl = util.format(data.imgFormat, v.id);
			html += util.format(itemTpl, v.id, imageUrl, iconHtml, __(v.title));
		});
		$el.find('#topic_box').html(html);;


		$el.on('click',"#topic_box li",function(){
			var itemID = $(this).data('id');
			jump(itemID);
		});
		$el.on('click',".liao_home",function(){
			pf.goPage('show', {showID: 'wdy'});
		});
		$el.on('click',".liao_lamp",function(){
			pf.goPage('show', {showID: 'display_cars'});
			
		});

	};

	var jump = function(itemID) {
		switch(itemID) {
			case 'aboutporsche':
				pf.goPage('detail', {detailID: "principle"});
				break;
			case 'pcpuxi':
				pf.goPage('detail', {detailID: "dealer"});
				break;
			default:
				pf.goPage('show', {showID: itemID});
				break;
		}
	};

	/**
	 * 页面显示时自动调用
	 */
	page.onShow = function() {
		// $el.show();
};

	/**
	 * 页面隐藏时调用
	 */
	page.onHide = function() {
		// alert(1);
		if ($('#container').hasClass('wdy')) {
			$('body').addClass('wdy');
			$('.operate-zoon').addClass("test_drive_b_show");
		};
		// $el.hide();
	};

	/**
	 * 页面中下部点击事件
	 */
	page.onMidEvent = function(flag) {
		// flag = prev || back || next
		console.log(flag);
	};

})();